const gulp = require('gulp');
const ejs = require('gulp-ejs');
const markdown = require('gulp-markdown-it');
const sass = require('gulp-sass')(require('sass'));
const ts = require('gulp-typescript');
const htmlmin = require('gulp-htmlmin');
const rename = require('gulp-rename');
const browserSync = require('browser-sync').create();
const jsonEditor = require('gulp-json-editor');
const data = require('gulp-data');
const fs = require('fs')
const path = require('path')




// 定义一个任务，将图片转换为 WebP 格式
gulp.task('images-to-webp', async function() {
    const webp = (await import('gulp-webp')).default; // Import gulp-webp

    return gulp.src('src/images/*.{jpg,jpeg,png}') // 指定源文件路径和图片类型
        .pipe(webp({ quality: 80 })) // 使用 gulp-webp 转换图片，设置质量为 80%
	.on('error', function(err) {
            console.error('Error in converting images to WebP:', err);
        })
        .pipe(gulp.dest('dist/images')); // 输出转换后的图片到目标目录
});


// Markdown 任务
gulp.task('markdown', function () {
    return gulp.src('src/markdown/**/*.md')
        .pipe(markdown()) // 使用 gulp-markdown-it
        .pipe(gulp.dest('dist'));
});

// TypeScript 编译任务
gulp.task('typescript', function() {
    return gulp.src('src/js/*.ts')
        .pipe(ts())
        .pipe(rename({ suffix: '.min' })) // 添加 .min 后缀
        .pipe(gulp.dest('dist/js'));
});

// CSS 处理任务
gulp.task('styles', function() {
    return gulp.src('src/css/*.scss')
        .pipe(sass())
        .pipe(rename({ suffix: '.min' })) // 添加 .min 后缀
        .pipe(gulp.dest('dist/css'));
});

// 图片处理任务
gulp.task('images', function() {
    return gulp.src('src/images/*.png')
//        .pipe(image())
//        .pipe(rename({ extname: '.webp' })) // 转换为 WebP 格式
        .pipe(gulp.dest('dist/images'));
});

// 生成资源路径 JSON
gulp.task('generate-assets-json', function() {
    return gulp.src('src/assets.json')
        .pipe(jsonEditor(function(json) {
            json.js = 'js/script.min.js'; // 生成的 JS 路径
            json.css = 'css/styles.min.css'; // 生成的 CSS 路径
            json.webp = 'images/image.webp'; // 生成的 WebP 图片路径
            return json;
        }))
        .pipe(gulp.dest('dist'));
});

// EJS 渲染任务
gulp.task('ejs', function() {
    const jsonFilePath = path.join(__dirname, 'dist', 'assets.json');
    const jsonData = JSON.parse(fs.readFileSync(jsonFilePath, 'utf8')); // 读取 JSON 文件

    console.log(data(function(file) {
            return require('./dist/assets.json'); // Load JSON data
        }))

    return gulp.src('src/templates/*.ejs')
        .pipe(ejs({'assets':jsonData}, {}, { ext: '.html' }))
        .pipe(htmlmin({ collapseWhitespace: true }))
	.pipe(rename({ extname:'.html'}))
        .pipe(gulp.dest('dist'));
});

// 监视文件变化
gulp.task('watch', function() {
    browserSync.init({
        server: {
            baseDir: './dist'
        }
    });
    gulp.watch('src/js/*.ts', gulp.series('typescript', 'generate-assets-json', 'ejs'));
    gulp.watch('src/css/*.scss', gulp.series('styles', 'generate-assets-json', 'ejs'));
    gulp.watch('src/images/*.png', gulp.series('images', 'generate-assets-json', 'ejs'));
    gulp.watch('src/templates/*.ejs', gulp.series('ejs'));
    gulp.watch('src/markdown/*.md', gulp.series('markdown'));
    gulp.watch('dist/**/*').on('change', browserSync.reload);
});

// 默认任务
gulp.task('default', gulp.series('typescript','markdown', 'styles', 'images', 'generate-assets-json', 'ejs', 'watch'));
